
<!DOCTYPE html> 
<html class="ui-mobile-rendering"> 

<head> 
	<title>Hellogue</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<meta name="viewport" content="width=device-width, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="http://localhost/rp_iteration3/themes/jquery.mobile.structure-1.0.1.min.css" />
    <link rel="stylesheet" href="http://localhost/rp_iteration3/themes/hellogue.min.css" />
       
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
    <link rel="stylesheet" href="http://dev.jtsage.com/cdn/datebox/1.0.1/jquery.mobile.datebox-1.0.1.css" /> 
    <script src="http://dev.jtsage.com/cdn/datebox/1.0.1/jquery.mobile.datebox-1.0.1.js"></script>
    
 
	
 	
	







        
     <!--Geolocation---------------------------------// -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
		var center;
		var map = null;
		var marker = null;

		function Newinitialize(lat,lng) {
		center = new google.maps.LatLng(lat,lng);
		var myOptions = {
			zoom: 17,	
			center: center,
			mapTypeId: google.maps.MapTypeId.ROADMAP
		}

		map = new google.maps.Map(document.getElementById("map_canvasRoast"), myOptions);

		var testmarkerpos = new google.maps.LatLng(52.624875,-1.142332);

		marker = new google.maps.Marker({
		position: center,
		map: map,
		animation: google.maps.Animation.DROP
		});

		var contentString1 = '<div id="content"><div id="siteNotice"><p class="info_box"><a href="#anotherpage">Hello Marker</a></p><p>Click for more information</p></div></div>';

		var infowindow1 = new google.maps.InfoWindow({
		content: contentString1,
		maxWidth: 200
		});

		google.maps.event.addListener(map, 'click', function(event) {placeMarker(event.latLng);});


		var new_lat1 = center.lat();
		var new_longi1 = center.lng();
		google.maps.event.addListener(marker, 'click', function() {window.location.href = "../hello_controller/choose_place?lat="+new_lat1+"&longi="+new_longi1;} );

		/*google.maps.event.addListener(testmarker, 'click', function() {
		infowindow1.open(map,testmarker);
		});
		*/


		}

		function placeMarker(location) {
    		var clickedLocation = new google.maps.LatLng(location);
    		if(marker){
				marker.setMap(null);
			}
			marker = new google.maps.Marker({
			position: location, 
			map: map,
			animation: google.maps.Animation.DROP
		});
	
		var new_lat = location.lat();
		var new_longi = location.lng();
	  	google.maps.event.addListener(marker, 'click', function() {window.location.href = "../hello_controller/choose_place?lat="+new_lat+"&longi="+new_longi;} );
  //map.setCenter(center);

		};

		function detectBrowser() {
			var useragent = navigator.userAgent;
			var mapdivMap = document.getElementById("map_canvasRoast");

			if (useragent.indexOf('iPhone') != -1 || useragent.indexOf('Android') != -1 ) {
				mapdivMap.style.width = '100%';
				mapdivMap.style.height = '100%';
			} 
			else {
				mapdivMap.style.width = '600px';
				mapdivMap.style.height = '800px';
			}
		};

	$(document).ready(function() {
  	$('.goMap').live('click', function() {
                                   //alert("fired");
	if(navigator.geolocation){
		detectBrowser();

		navigator.geolocation.getCurrentPosition(function(position){
		Newinitialize(position.coords.latitude,position.coords.longitude);
	});
	}
	else
	{
		detectBrowser();
		Newinitialize(52.636161,-1.133065);
	}
	});
	});
	</script>
    
</head> 

<body> 
 	
 	<div id="bodyload" data-role = "page">


	
	<div id="header" data-role="header" data-position="fixed">
 		
 		<a data-rel="back" data-role="button" data-icon="back" data-iconpos="left">Back</a>
		<h1>Post New Hello</h1>
		<a href="http://localhost/rp_iteration3/index.php/hello_controller/to_create_hello" data-role="button" id="autoid" class="goMap" data-icon="createhello" data-iconpos="right">New</a>

		<div data-role="navbar" class="ui-navbar" data-iconpos="left">
			<ul>
						<li><a href="http://localhost/rp_iteration3/index.php/feed_controller"  data-transition="slidedown" data-role="button" data-icon="world"><b>Feed</b></a></li>
	    		    
	   					<li><a href="http://localhost/rp_iteration3/index.php/notification_controller/show_notification" data-role="button" data-icon="notification" data-transition="slidedown" data-inline="true"><b>Notice</b></a></li>
					
						<li><a href="http://localhost/rp_iteration3/index.php/messege_controller/show_my_messege" data-role="button" data-icon="messages" data-transition="slidedown" data-inline="true"><b>Mesg</b></a></li>
					
						<li><a href="http://localhost/rp_iteration3/index.php/user_controller/show_user_profile?userID=38" data-role="button" data-icon="me" data-transition="slidedown" data-inline="true"><b>Profile</b></a></li>
					
			</ul>
		</div><!-- navbar -->
	</div><!-- header -->
	


	


		<script>
    $("#bodyload").ready(function () {
      $("#autoid").click();
    });
</script>
	
		
	
	
		


<div data-role="content" style="width:100%; height:100%; padding:0;">
<div id="map_canvasRoast" style="width:100%; height:100%;"></div>
</div>
</div>





</body>



</html>
